:global{
	/* 自定义滚动条 */
	::-webkit-scrollbar {
	 width: 0.5rem; /* 设置滚动条宽度 */
 }
 ::-webkit-scrollbar-thumb {
	 background-color: #c3c3c3; /* 滚动条颜色 */
	 border-radius: 6px; /* 滚动条边角半径 */
	 height: 10px;
 }
 ::-webkit-scrollbar-track {
	 background-color: transparent; /* 滚动条轨道颜色 */
	 border-radius: 6px; /* 滚动条轨道边角半径 */
 }
 /* 鼠标悬停效果 */
 ::-webkit-scrollbar-thumb:hover {
	 background-color: #f1f1f1; /* 悬停时滑块颜色 */
 }
}
.box_view {
 position: relative;
 width: 100%;
 height: 100%;
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 5rem 0 10rem 0;
 max-width: 600px;
 margin: 0 auto;
 .no_data_view{
	 width: 100%;
	 margin-top: 50%;
	 display: flex;
	 flex-direction: column;
	 justify-content: center;
	 align-items: center;
	 .img_view{
		 border-radius: 50%;
		 border: #d9d9e3 1px solid;
		 width: 5rem;
		 height: 5rem;
		 padding: 1rem;
		 box-sizing: border-box;
		 svg{
			 color: white;
		 }
	 }
	 h2{
		 font-size: 1.5rem;
	 }
 }
 .list_view {
	 width: 100%;
	 overflow: hidden;
	 .msg_item {
		 display: flex;
		 flex-direction: row;
		 margin-bottom: 2rem;
		 img {
			 width: 1.6rem;
			 height: 1.6rem;
			 border-radius: 50%;
			 margin-right: 0.5rem;
			 user-select: none;
			 user-select: none;
		 }
		 .content_view {
			 display: flex;
			 flex-direction: column;
			 width: 100%;
			 overflow: hidden;
			 .name {
				 user-select: none;
				 font-size: 1rem;
				 font-weight: 600;
				 margin: 0;
			 }
			 .content {
				 font-size: 1rem;
				 margin: 0.5rem 0 0 0;
				 word-wrap: break-word;
			 }
			 .actions_view{
				 display: flex;
				 margin-top: 0.2rem;
				 svg{
					 cursor: pointer;
					 color: #c3c3c3;
					 margin-right: 0.5rem;
					 transform: scale(0.9);
				 }
			 }
			 .actions_view svg:hover{
				 color: #000;
			 }
		 }
	 }
 }
 .send_view {
	 position: fixed;
	 background: white;
	 padding: 1rem 0;
	 box-sizing: border-box;
	 bottom: 0;
	 left: 0;
	 right: 0;
	 margin: 0 auto;
	 display: flex;
	 justify-content: center;
	 width: 100%;
	 .textarea_view {
		 border-radius: 1rem;
		 overflow: hidden;
		 position: relative;
		 max-width: 800px;
		 width: 100%;
		 display: flex;
		 justify-content: center;
	 }
	 textarea {
		 font-family: auto;
		 width: 90%;
		 border: #8e8ea0 1px solid;
		 border-radius: 1rem;
		 padding: 0 3rem 0 1rem;
		 font-size: 1rem;
		 height: 3rem;
		 line-height: 3rem;
		 box-sizing: border-box;
		 resize: none; /* 禁止用户手动调整大小 */
		 overflow-y: hidden;
	 }
	 .send_span{
		 cursor: pointer;
		 position: absolute;
		 right: 7%;
		 bottom: 0.6rem;
		 background-color: #d9d9e3;
		 border-radius: 20%;
		 width: 2rem;
		 height: 2rem;
		 display: flex;
		 justify-content: center;
		 align-items: center;
		 overflow: hidden;
		 color: white;
		 svg{
			 background-color: #d9d9e3;
		 }
	 }
	 .active{
		 background-color: black;
		 svg{
			 background-color: black;
		 }
	 }

	 .stop_span{
		 cursor: pointer;
		 position: absolute;
		 right: 7%;
		 bottom: 0.6rem;
		 background-color: white;
		 border: 2px black solid;
		 border-radius: 50%;
		 box-sizing: border-box;
		 width: 1.8rem;
		 height: 1.8rem;
		 display: flex;
		 justify-content: center;
		 align-items: center;
		 overflow: hidden;
		 color: black;
	 }
	 /* 获得焦点时的样式 */
	 textarea:focus {
		 border-color: #8e8ea0; /* 获得焦点时的边框颜色 */
		 outline: none; /* 移除默认的蓝色轮廓 */
	 }
	 /* 自定义滚动条 */
	 textarea::-webkit-scrollbar {
		 width: 0.5rem; /* 设置滚动条宽度 */
	 }
	 textarea::-webkit-scrollbar-thumb {
		 background-color: rgba(217, 217, 227, .8); /* 滚动条颜色 */
		 border-radius: 6px; /* 滚动条边角半径 */
	 }
	 textarea::-webkit-scrollbar-track {
		 background-color: transparent; /* 滚动条轨道颜色 */
		 border-radius: 6px; /* 滚动条轨道边角半径 */
		 /* 设置滚动条轨道的高度 */
	 }
 }
}
.go_top_btn {
 position: absolute;
 top: 1rem;
 right: 1rem;
 border: none;
}
.go_bottom_btn{
 position: fixed;
 border: 1px solid #c3c3c3;
 bottom: 6rem;
 width: 2.2rem;
 height: 2.2rem;
 display: flex;
 justify-content: center;
 align-items: center;
 background: white;
 left: 0;
 right: 0;
 margin: 0 auto;
 border-radius: 50%;
 svg{
	 color: #464646;
 }
}

.go_top_btn{
 position: fixed;
 border: 1px solid #c3c3c3;
 top: 5rem;
 width: 2rem;
 height: 2rem;
 display: flex;
 justify-content: center;
 align-items: center;
 background: white;
 right: 2rem;
 margin: 0 auto;
 border-radius: 50%;
 svg{
	 transform: rotate(180deg);
 }
}